<!-- 66 -->
<template>
  <div  class="page-wrap">
    <a-space class="common-button-group">
      <a-button
      class="t9-form-wideget-btn-default"
        type="primary"
        :loading="searchBtnLoading"
        @click="handleSearch"
        >{{ $t("common_query") }}</a-button
      >
    </a-space>
    <t-query-form
      layout="inline"
      group="trackIn"
      ref="queryForm"
      :rules="rules"
      :model="queryForm"
    >
       <a-form-item :label="$t('T9_shopId')" name="shopId" prop="shopId">
        <a-select
          v-model:value="queryForm.shopId"
          :placeholder="$t('common_pleaseSelect')"
           allow-clear
           @change="handleShopId"
          class="t9-form-wideget-input-default"
        >
          <a-select-option
            v-for="item in options.shopIdList"
            :key="item.value"
            :value="item.value"
            >{{ item.label }}</a-select-option
          >
        </a-select>
      </a-form-item>
       <a-form-item :label="$t('T9_cstId')" name="cstId" prop="cstId">
       <a-input  class="t9-form-wideget-input-default"  allow-clear v-model:value="queryForm.cstId" :placeholder="$t('common_pleaseEnter1')" />
      </a-form-item>
       <a-form-item :label="$t('T9_actionType')" name="actionType" prop="actionType">
        <a-select
          v-model:value="queryForm.actionType"
          :placeholder="$t('common_pleaseSelect')"
           allow-clear
           show-search
          class="t9-form-wideget-input-default"
        >
          <a-select-option
            v-for="item in options.shopIdList"
            :key="item.value"
            :value="item.value"
            >{{ item.label }}</a-select-option
          >
        </a-select>
      </a-form-item>
        <a-form-item :label="$t('T9_glassId')" name="glassId" prop="glassId">
       <a-input  class="t9-form-wideget-input-default"  allow-clear v-model:value="queryForm.glassId" :placeholder="$t('common_pleaseEnter1')" />
      </a-form-item>
    </t-query-form>
      <a-row
      type="flex"
      justify="space-between"
      align="middle"
      class="global-oper-row mt-1"
    >
      <a-col :span="15" class="global-oper-row-title">{{
        $t("T9_cstInfo")
      }}</a-col>
      <a-col :span="8" class="global-oper-row-extra">
        <a-button class="t9-form-wideget-btn-default" type="primary" :loading="cstInfoExportBtnLoading" @click="getCstInfoExport">{{ $t("T9_toExcel") }}</a-button>
      </a-col>
    </a-row>
    <div>
      <t-table align="center" :loading="searchBtnLoading"  ref="table" :data="list.cstInfo"  max-height="100%">
      <t-column min-width="100" field="cstId" :title="$t('T9_cstId')" />
      <t-column min-width="100" field="bayId" :title="$t('T9_bayId')" />
      <t-column min-width="100" field="productType" :title="$t('T9_productType')" />
      <t-column min-width="100" field="productId" :title="$t('T9_productId')" />
      <t-column min-width="100" field="route" :title="$t('T9_route')" />
      <t-column min-width="100" field="operation" :title="$t('T9_operation')" />
      <t-column min-width="100" field="state" :title="$t('T9_state')" />
      <t-column min-width="100" field="processState" :title="$t('T9_processState')" />
      <t-column min-width="100" field="holdState" :title="$t('T9_holdState')" />
      <t-column min-width="100" field="reworkState" :title="$t('T9_reworkState')" />
      <t-column min-width="100" field="grade" :title="$t('T9_grade')" />
      <t-column min-width="100" field="glassQty" :title="$t('T9_glassQty')" />
      <t-column min-width="100" field="eqpId" :title="$t('T9_eqpId')" />
    </t-table>
    </div>
  <a-row
      type="flex"
      justify="space-between"
      align="middle"
      class="global-oper-row mt-1"
    >
      <a-col :span="15" class="global-oper-row-title">{{
        $t("T9_holdCodeList")
      }}</a-col>
      <a-col :span="8" class="global-oper-row-extra">
        <a-button class="t9-form-wideget-btn-default" type="primary" :loading="glassListExportBtnLoading" @click="getGlassListExport">{{ $t("T9_toExcel") }}</a-button>
      </a-col>
    </a-row>
    <div class="page-wrap-table">
    <t-table align="center" :data="list.glassList"   max-height="100%" @radio-change="handleCheckClick" >
      <t-column type="radio" width="50"></t-column>
      <t-column min-width="100" field="route" :title="$t('T9_route')" />
      <t-column min-width="100" field="operation" :title="$t('T9_operation')" />
      <t-column min-width="100" field="resaonCode" :title="$t('T9_resaonCode')" />
      <t-column min-width="100" field="actionComment" :title="$t('T9_actionComment')" />
      <t-column min-width="100" field="reasonDescription" :title="$t('T9_reasonDescription')" />
      <t-column min-width="100" field="holdReleasedDepartment" :title="$t('T9_holdReleasedDepartment')" />
      <t-column min-width="100" field="eventUser" :title="$t('T9_eventUser')" />
      <t-column min-width="100" field="eventTime" :title="$t('T9_eventTime')" />
      <t-column min-width="100" field="actionType" :title="$t('T9_actionType')" />
    </t-table>
   </div>
     <a-row
      type="flex"
      justify="space-between"
      align="middle"
      class="global-oper-row mt-1"
    >
      <a-col :span="15" class="global-oper-row-title">{{
        $t("T9_glassHoldList")
      }}</a-col>
      <a-col :span="8" class="global-oper-row-extra">
        <a-button class="t9-form-wideget-btn-default" type="primary" :loading="glassListExportBtnLoading" @click="getGlassListExport">{{ $t("T9_toExcel") }}</a-button>
      </a-col>
    </a-row>
    <div class="page-wrap-table">
    <t-table align="center" :data="list.glassList"   max-height="100%" @checkbox-change="handleCheckClick" >
      <t-column type="checkbox" width="50"></t-column>
      <t-column min-width="100" field="slot" :title="$t('T9_slot')" />
      <t-column min-width="100" field="glassId" :title="$t('T9_glassId')" />
      <t-column min-width="100" field="operation" :title="$t('T9_operation')" />
      <t-column min-width="100" field="holdCode" :title="$t('T9_holdCode')" />
      <t-column min-width="100" field="releaseDepartment" :title="$t('T9_releaseDepartment')" />
      <t-column min-width="100" field="comment" :title="$t('T9_comment')" />
      <t-column min-width="100" field="actionType" :title="$t('T9_actionType')" />
      <t-column min-width="100" field="route" :title="$t('T9_route')" />
    </t-table>
   </div>
    <a-row
      type="flex"
      justify="space-between"
      align="middle"
      class="global-oper-row mt-1"
    >
      <a-col :span="15" class="global-oper-row-title">{{
        $t("T9_cancelHoldList")
      }}</a-col>
      <a-col :span="8" class="global-oper-row-extra">
        <a-button class="t9-form-wideget-btn-default" type="primary" :loading="glassListExportBtnLoading" @click="getGlassListExport">{{ $t("T9_toExcel") }}</a-button>
      </a-col>
    </a-row>
    <div class="page-wrap-table">
    <t-table align="center" :data="list.glassList"   max-height="100%" @checkbox-change="handleCheckClick" >
      <t-column type="checkbox" width="50"></t-column>
      <t-column min-width="100" field="slot" :title="$t('T9_slot')" />
      <t-column min-width="100" field="glassId" :title="$t('T9_glassId')" />
      <t-column min-width="100" field="operation" :title="$t('T9_operation')" />
      <t-column min-width="100" field="holdCode" :title="$t('T9_holdCode')" />
      <t-column min-width="100" field="releaseDepartment" :title="$t('T9_releaseDepartment')" />
      <t-column min-width="100" field="comment" :title="$t('T9_comment')" />
      <t-column min-width="100" field="actionType" :title="$t('T9_actionType')" />
      <t-column min-width="100" field="route" :title="$t('T9_route')" />
    </t-table>
   </div>
    <div class='data-form page-wrap-bottom mt-1'>
        <a-form
          ref="dataForm"
          layout="inline"
          :colon="false"
          :model="dataForm"
          :rules="rules2"
        >
          <a-form-item :label="$t('T9_comment')" name="eventComment" style="width:100%">
            <a-row type="flex" justify="space-between" align="middle">
              <a-col :span="21">
                <a-textarea allow-clear v-model:value="dataForm.eventComment" :rows="1" :title="dataForm.eventComment" />
              </a-col>
              <a-col :span="2">
                <a-button class="t9-form-wideget-btn-default" type="primary" :loading="confirmBtnLoading" @click="handleConfirm">{{ $t('T9_confirm') }}</a-button>
              </a-col>
            </a-row>
          </a-form-item>
        </a-form>
      </div>
  </div>
</template>

<script>
  import { defineComponent } from 'vue'
  import * as api from '@/api/common'
  import confirmUserMixin from '@/mixins/confirmUser.mixin'
  import { shopIdList } from '@/views/options'
  import { downloadBlobFile } from '@/utils/download'

  export default defineComponent({
    name: 'trackIn',
    mixins: [confirmUserMixin],
    data() {
      return {
        searchBtnLoading: false,
        confirmBtnLoading: false,
        cstInfoExportBtnLoading: false,
        glassListExportBtnLoading: false,
        glassListRow: {},
        allRow: [],
        list: {
          cstInfo: [],
          glassList: []
        },
        export: false,
        eqpIdList: [],
        portIdList: [],
        recipeList: [],
        lotList: [],
        eqpInfo: {},
        queryForm: {
          shopId: 'ARRAY',
          cstId: undefined,
          actionType: undefined,
          glassId: undefined
        },
        dataForm: {
          eqpId: undefined,
          desc: '',
          portId: undefined,
          eqpType: '',
          sampleCount: '',
          machineEvent: '',
          machineRunMode: '',
          ifMode: '',
          state: '',
          recipeName: undefined,
          eqpHoldState: '',
          e10State: '',
          lastComment: '',
          recipeRunMode: '',
          eventComment: undefined,
          eventUser: undefined
        },
        options: {
          shopIdList
        },
        rules: {
          shopId: [{ required: true, message: this.$t('valid_required2'), trigger: 'change' }],
          cstId: [{ required: true, message: this.$t('valid_required2'), trigger: 'change' }]
        },
        rules2: {
          eqpId: [{ required: true, message: this.$t('valid_required2'), trigger: 'change' }],
          portId: [{ required: true, message: this.$t('valid_required2'), trigger: 'change' }],
          recipeName: [{ required: true, message: this.$t('valid_required2'), trigger: 'change' }],
          eventComment: [{ required: true, message: this.$t('valid_required2'), trigger: 'blur' },
          { max: 500, message: this.$t('changePoint_maxLength', { n: 500 }), trigger: 'blur' }]
        }
      }
    },
    watch: {},
    created() {
    },
    methods: {
      // checkAll(val) {
      //   this.allRow = val.record
      //   console.log(val, 'val')
      // },
      handleCheckClick(row) {
        this.glassListRow = row.row
        this.handleShopId()
        this.lotList.push(row.row)
      },
       checCheckboxkMethod2({ row }) {
         if (!Object.keys(this.glassListRow).length) return true
         if (row.owner === this.glassListRow.owner
         && row.productId === this.glassListRow.productId && row.route === this.glassListRow.route
         && row.operation === this.glassListRow.operation) {
                return true
            }
                return false
        },
      handleConfirm() {
         this.$refs.dataForm.validate().then(() => {
           if (!this.lotList.length) {
             this.$message.error(this.$t('T9_errTip1'))
             return
           }
           this.confirmUser(() => {
            this.handleOk()
            })
        }).catch((error) => {
          console.log('error', error)
        })
      },
      handleOk() {
        this.visible = false
        this.confirmBtnLoading = true
         const params = {
           detailProcessOperationType: this.list.cstInfo[0].detailProcessOperationType,
           eqpId: this.dataForm.eqpId,
           eventComment: this.dataForm.eventComment,
           eventUser: this.$store.state.user.uid,
           ifMode: this.dataForm.ifMode,
           language: 'English',
           lotId: this.glassListRow.lotId,
           machineRunMode: this.dataForm.machineRunMode,
           operation: this.glassListRow.operation,
           pexMachineGroup: this.eqpInfo.pexMachineGroup,
           portId: this.dataForm.portId,
           productId: this.list.cstInfo[0].productId,
           recipeName: this.dataForm.recipeName,
           recipeRunMode: this.dataForm.recipeRunMode,
           route: this.list.cstInfo[0].route,
           state: this.list.cstInfo[0].state
          }
          api.trackIn(params).then(res => {
             this.confirmBtnLoading = false
             this.handleSearch()
             this.glassListRow = []
            console.log(res)
          })
         .catch((error) => {
            this.confirmBtnLoading = false
            console.error(error)
          })
      },
      handleRecipeRunMode(val, o) {
        this.dataForm.recipeRunMode = o.mode
      },
      getEqpStatedesc(o) {
        const params = {
          eqpId: o,
          shopId: this.queryForm.shopId
        }
        api.getTrackInEqpInfo(params).then(res => {
        this.eqpInfo = res
        this.dataForm.desc = res.desc
        this.dataForm.eqpType = res.eqpType
        this.dataForm.sampleCount = res.sampleCount
        this.dataForm.machineEvent = res.machineEvent
        this.dataForm.machineRunMode = res.machineRunMode
        this.dataForm.ifMode = res.ifMode
        this.dataForm.state = res.state
        this.dataForm.eqpHoldState = res.eqpHoldState
        this.dataForm.e10State = res.e10State
        this.dataForm.lastComment = res.lastComment
         const obj = {
          eqpId: this.dataForm.eqpId,
          areaName: this.eqpInfo.areaName,
          processState: this.list.cstInfo[0].processState,
          shopId: this.queryForm.shopId,
          pexMachineGroup: this.eqpInfo.pexMachineGroup
        }
        api.getPort(obj).then(result => {
          console.log(result, '---')
          this.portIdList = result
         })
        })

        const list = {
          eqpId: this.dataForm.eqpId,
          operation: this.glassListRow.operation,
          productVer: this.list.cstInfo[0].productVer,
          shopId: this.queryForm.shopId,
          productId: this.glassListRow.productId,
          route: this.glassListRow.route
        }
        api.getRecipe(list).then(res => {
          this.recipeList = res
        })
      },
      handleShopId() {
        const params = {
         shopId: this.queryForm.shopId,
         glassId: this.glassListRow.glassId
        }
        api.getTrackInEqpId(params).then(res => {
          this.eqpIdList = res
        })
      },
      handleSearch() {
        this.$refs.queryForm
          .validate()
          .then(() => {
            if (this.searchBtnLoading) return
           this.searchBtnLoading = true
          const basicParams = {
                menuName: 'trackIn',
                usage: 'getCstInfo',
                site: 'T7'
               }
            const params = { ...this.queryForm, ...basicParams }
            api
              .getList(params)
              .then((res) => {
                this.list.cstInfo = res
                 this.$refs.table.loadData(this.list.cstInfo)
                console.log(res)
              })
              .catch((error) => {
                this.searchBtnLoading = false
                console.error(error)
              })
              const glassParams = {
                menuName: 'trackIn',
                usage: 'getGlassList',
                site: 'T7'
               }
            const obj = { ...this.queryForm, ...glassParams }
            api
              .getList(obj)
              .then((res) => {
                this.list.glassList = res || []
                this.searchBtnLoading = false
                console.log(res)
              })
              .catch((error) => {
                this.searchBtnLoading = false
                console.error(error)
              })
          })
          .catch((error) => {
            console.log('error', error)
          })
      },
      // cstInfo导出
      getCstInfoExport() {
        if (!this.list.cstInfo.length) return
        if (this.cstInfoExportBtnLoading) return
        this.cstInfoExportBtnLoading = true
        const params = {
           menuName: 'trackIn',
           usage: 'getCstInfo',
          site: 'T7',
          export: true,
          ...this.queryForm
        }
        api.getList(params).then(res => {
          downloadBlobFile(res, 'cstInfo')
          this.cstInfoExportBtnLoading = false
        }).catch(error => {
          console.log(error)
          this.cstInfoExportBtnLoading = false
        })
      },
      // glassList导出
      getGlassListExport() {
        if (!this.list.glassList.length) return
         if (this.glassListExportBtnLoading) return
        this.glassListExportBtnLoading = true
        const params = {
           menuName: 'trackIn',
          usage: 'getGlassList',
          site: 'T7',
          export: true,
          ...this.queryForm
        }
         api.getList(params).then(res => {
          downloadBlobFile(res, 'glassList')
           this.glassListExportBtnLoading = false
        }).catch(error => {
          console.log(error)
          this.glassListExportBtnLoading = false
        })
      }
    }
  })
</script>
